<template>
  <div class="search">
    <el-card>
      <el-row :gutter="15" class="form">
        <el-form ref="stuForm" :model="formData" size="medium" label-width="100px">
          <el-col :span="5">
            <el-form-item :label="labels.warehouseCode">
              <el-input v-model="formData.name" placeholder="请输入" clearable :style="{width: '100%'}" />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item :label="labels.areaName">
              <el-input v-model="formData.areaName" placeholder="请输入" clearable :style="{width: '100%'}" />
            </el-form-item>
          </el-col>
          <el-col v-if="labels.isShowInput" :span="5">
            <el-form-item :label="labels.status">
              <el-input v-model="formData.areaName" placeholder="请输入" clearable :style="{width: '100%'}" />
            </el-form-item>
          </el-col>
          <el-col v-if="labels.isShowSelect" :span="5">
            <el-form-item :label="labels.status">
              <el-select v-model="formData.areaStatus" placeholder="请选择">
                <el-option
                  v-for="item in areaStatus.areaStatus"
                  :key="item.id"
                  :label="item.value"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item size="large">
              <el-button type="warning" @click="submitForm">搜索</el-button>
              <el-button type="warning" plain="" @click="resetForm">重置</el-button>
            </el-form-item>
          </el-col>
        </el-form>
      </el-row>
    </el-card>
  </div>
</template>
<script>
// 导入枚举数据
import areaStatus from '@/constant/areaStatus'
export default {
  components: {},
  props: {
    labels: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      // 状态枚举数据
      areaStatus,
      formData: {
        name: '',
        areaName: '',
        areaStatus: 2
      }
    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    async submitForm() {
      this.$emit('searchWareHouse', this.formData)
    },
    resetForm() {
      this.$refs['stuForm'].resetFields()
      this.formData = {
        name: '',
        areaName: '',
        areaStatus: 2
      }
    }
  }
}

</script>
<style lang="scss" scoped>
.search{
    margin: 20px;
    .form{
      padding-top: 20px;
    }
}
</style>
